<!DOCTYPE html>
<html>
<head>
<title>Welcome to awdplaform</title>

    <link rel="stylesheet" href="/static/css/countdown.demo.css">
	<link rel="stylesheet" href="/static/css/bootstrap.css">
<style>
    
           .row{
                vertical-align: middle;
            }

</style>

</head>
<body>
<div class="container">
    <div class="row">
        <nav class="navbar navbar-default" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                <a class="navbar-brand" href="/"><label id='banner'>Welcome to awdplaform</label></a>
                </div>
                <div>
                    <ul class="nav navbar-nav">
                        <li class="{% if url_for('index') == request.path %}active{% endif %}"><a href="{{ url_for('index') }}">首页</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal1">队伍信息</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal2">解题提示</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal3">得分情况</a></li>
                        <li><a class="about" data-toggle="modal" data-target="#myModal4">参赛规则</a></li>
                        {%if session.get('user_id') == 'admin'%}
                        <li><a class="about" data-toggle="modal" href="/admin">后台管理</a></li>
                        {%endif%}
                        <li><a class="about" data-toggle="modal" href="/logout">退出登录</a></li>
                    </ul>
                </div>
            </div>
        </nav>
    </div>
</div>
<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					队伍信息
				</h4>
			</div>
			<div class="modal-body">
                <div class="modal-body">
                	<div class="panel-body">
            		<table class="table">
                      <thead>
                        <tr>
                          <th>TEAM</th>
                          <th>SSH-USER</th>
                          <th>SSH-PASS</th>
                          <th>SSH-PORT</th>
                        </tr>
                      </thead>
                      <tbody id="ssh_info">

                      </tbody>
                </table>
            	</div>

			</div>			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default"
						data-dismiss="modal">关闭
				</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					解题提示
				</h4>
			</div>
			<div class="modal-body" id="infos">

                <br />
                <br />

			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default"
						data-dismiss="modal">关闭
				</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					得分情况
				</h4>
			</div>
			<div class="modal-body">
                	<div class="panel-body">
            		<table class="table">
                      <thead>
                        <tr>
                          <th>ID</th>
                          <th>消息</th>
                          <th>得分</th>
                          <th>轮询次数</th>
                          <th>攻击时间</th>
                        </tr>
                      </thead>
                      <tbody id="rounds">

                      </tbody>
                </table>
            	</div>

			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<div class="modal fade" id="myModal4" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×
				</button>
				<h4 class="modal-title" id="myModalLabel">
					参赛规则
				</h4>
			</div>
			<div class="modal-body">
                主机信息
                <ul>
                    <li>队伍分配主机，通过指定的端口和密码进行连接</li>
                    <li>主机上运行一个web或多个服务，需要选手保证其可用性审计代码，攻击其他队伍</li>
                    <li>通过漏洞获取其他队伍主机权限，读取服务器上的flag并提交到flag服务器</li>
                </ul>
                攻击检测
                <ul>
                    <li>每次成功攻击，攻击队伍可平分该flag的200分，被攻击者扣除200分，轮询时间1分钟</li>
                    <li>选手需要保证己方服务的可用性，服务故障扣除200分，被服务无故障的队伍平分，轮询时间1分钟</li>
                    <li>得分在下一轮开始时计算</li>
                </ul>
                其他
                <ul>
                    <li>选手可以获取所有的攻击情况以及当前的分数，刷新间隔1分钟</li>
                    <li>不允许使用任何形式的DOS攻击</li>
                </ul>
                <br />
                <br />
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default"
						data-dismiss="modal">关闭
				</button>
			</div>
		</div><!-- /.modal-content -->
	</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

{% block index %}{% endblock %}


<div id="collapseTwo" class="container panel-collapse collapse in">


        <div > <center><h1 class="alt-1" id="mathtimeleft"></h1> <span id="mathtimelabel">距离比赛结束</span></center></div>


    <br>
	

<div class="row" id="show_container">


</div>





    <div class="panel-body">
        <h1><label id='ctoken'></label></h1>
        <center><h2>当前轮次：<label id='cround'></label> 当前排名：<label id='cround_rank'></label></h2></center>

    		<table class="table">
                <caption></caption>
                <thead>
                <tr id="teams_tr">
                    <th>#</th> 
                    <th>TEAM</th>             
                    <th>实时分数</th>
                </tr>
                </thead>
                <tbody id="team">
                </tbody>
            </table>
	</div>
</div>

<div class="container well" style="margin-top: 1%">
    <div class="row">
        <div class="footer text-center">
            <div class="footer-title">
                <h4>提交Flag</h4>
            </div>

            
            <div class="footer-banner" id='flagform'>
                <form method="POST" id="myform" action="flag?token=' + token + '" onsubmit="return submitflag()">
                        <input type="text" name="flag" id="flag">
                        <input type="submit" value="提交">
                </form>
                <label id="msg"></label>
            </div>
            
            <div class="footer-banner">
                <small>自动提交：<label id='mytoken'></label></small>        
            </div>            
        </div>
    </div>
</div>
</body>
</html>




<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/bootstrap.js"></script>



<script type="text/javascript">
    function show_container_ctr(data){

        console.log(data);

        var divshow = $("#show_container");
        divshow.empty();;

        var count=data.length;
        console.log(count);
        var offset = (12 - count*2)/2;
        console.log(offset);

        count = 0;

        for (x in data){
            var coldiv = $('<div></div>');

            coldiv.addClass('col-lg-2 text-center');
            if (count==0) coldiv.addClass('col-lg-offset-'+offset);
            count++;
            //for(y in data[x]){      
                //console.log(y);  
                console.log(data[x]);

                var paneldiv = $('<div></div>');
                paneldiv.addClass('panel panel-default');

                var paneldheader = $('<div></div>');
                paneldheader.addClass('panel-heading');
                paneldheader.text(data[x]['container']);

                var paneldbody = $('<div></div>');
                paneldbody.addClass('panel-body');
                paneldbody.text(data[x]['attack_stat']+'|'+data[x]['check_stat']);


                var paneldfooter = $('<div></div>'); 
                paneldfooter.addClass('panel-footer');
                paneldfooter.text(data[x]['score']);
                paneldiv.append(paneldheader);
                paneldiv.append(paneldbody);
                paneldiv.append(paneldfooter);
                
                
            //}
            coldiv.append(paneldiv);
            divshow.append(coldiv);
        }
    }    

    var data = [

            {'container':'pwnable','stat':1,'score':999},
            {'container':'http0','stat':0,'score':1000},
            {'container':'http1','stat':0,'score':1000},
            //{'container':'http2','stat':0,'score':1000},
            ];

    //show_container_ctr(data);

</script> 



<script type="text/javascript">
    var myname;
    function get_math() {



    $.getJSON('/timedelta',
            function (result) {         
                document.title = result['name'];
                $("#banner").text(result['name']);

                timeleft = result['timeleft'];
                $("#mathtimeleft").html(timeleft);  
                window.jQuery(function ($) {
                    "use strict";
                    $('.alt-1').countDown({
                        css_class: 'countdown-alt-1'
                    });
                });
            }
            );   


        $.getJSON('/team',
            function (result) {
                $("#ssh_info").html("");
            

                var token = result['token'];
                var name = result['teamname'];
                $("#myform").attr("action","flag?token=" + token );
                $("#mytoken").text("curl -d 'flag=flag' http://:9000/flag?token=" + token);
                $("#ctoken").text('队伍名:' + name + ' Token:' + token);   
                myname=name;
                mytoken = token;
                for (x in result['containers']){                 
                    var cname = result['containers'][x]['typename'];
                    var score = result['containers'][x]['score'];
                    //var ip = result[x]['ip'];
                    var ssh_user = result['containers'][x]['sshaccount'];
                    var ssh_password = result['containers'][x]['sshpassword'];
                    var ssh_port = result['containers'][x]['sshport'];
                    var serviceport = result['containers'][x]['serviceport'];
                    $("#ssh_info").append('<tr>'+
                    '<td>'+cname+'</td>' +
                    //'<td>'+token+'</td>' +
                    '<td>'+ssh_user+'</td>'+
                    '<td>'+ssh_password+'</td>'+
                    '<td>'+ssh_port+'</td>'+
                    '</tr>');
        
                
                }
            }
        );
    }
get_math();                         // 比赛时间、队伍信息 刷新一次
//setInterval('get_math()', 2*1000); // 比赛时间、队伍信息 token 每30秒刷新一次
</script>

<script src="/static/js/jquery.countdown.js"></script> 

<script type="text/javascript">
    var mytoken ;
    function get_temps() {

        $.getJSON('/team',
            function (result) {
                var data=new Array(); //{'container':'pwnable','stat':1,'score':999},

                for(x in result['containers']){
                    data.push({'container':result['containers'][x]['typename'],
                                'attack_stat':result['containers'][x]['attack_stat'],
                                'score':result['containers'][x]['score'],
                                'check_stat':result['containers'][x]['check_stat'],
                            });
                }
                show_container_ctr(data);



            });
                



        $.getJSON('/teams',
            function (result) {
                $("#team").html("");

                //$('#teams_tr').append("<th>1111</th>");
                var a=new Array();
                var p = 0;

                var o = '<th>#</th><th>TEAM</th><th>实时分数</th>';

                for(j in result['typename'])
                {
                    o += "<th>"+result['typename'][j]+"</th>";
                    a[p]=result['typename'][j];
                    p++;
                }

                $('#teams_tr').html("");
                $('#teams_tr').append(o);


                for (x in result['teams']){
                    var name = result['teams'][x]['name'];
                    //var token = result[x]['token'];
                    var score = result['teams'][x]['scoresum'];
                    var rank = result['teams'][x]['rank'];

                    tmp=new Array();

                    for(x2 in  result['teams'][x]['containers'])
                    {
                        for(x3 in a){
                            if(a[x3]== result['teams'][x]['containers'][x2]['typename']){
                                tmp[x3]=result['teams'][x]['containers'][x2]['score'] +'|' +result['teams'][x]['containers'][x2]['attack_stat']+'|'+result['teams'][x]['containers'][x2]['check_stat'] ;
                            }
                        }
                    }
                    trstring = '<tr>'+
                    '<td>'+rank+'</td>' +    
                    '<td>'+name+'</td>' +
                    //'<td>'+token+'</td>'+
                    '<td>'+score+'</td>'

                    for(i=0;i<tmp.length;i++) trstring+='<td>'+tmp[i]+'</td>'
                    //'<td>'+ip+'</td>'+
                    trstring+='</tr>';
                    $("#team").append(trstring);
                    if(name == myname){
                        $("#cround_rank").html(rank);
                    }
                }
            }
        );
        $.getJSON('/rounds',
            function (result) {
                $("#rounds").html("");
                for (x in result){
                    var _id = result[x]['id'];
                    var msg = result[x]['msg'];
                    var score = result[x]['score'];
                    var rounds = result[x]['rounds'];
                    var time = result[x]['time'];
                    $("#rounds").append('<tr>'+
                    '<td>'+_id+'</td>' +
                    '<td>'+msg+'</td>'+
                    '<td>'+score+'</td>'+
                    '<td>'+rounds+'</td>'+
                    '<td>'+time+'</td>'+
                    '</tr>');
                }
            }
        );

        $.getJSON('/current_rounds',
            function (result) {
                $("#cround").html(result);           
            }
        );
        
        
        $.getJSON('/info/2',
            function (result) {
                $("#infos").html("");
                for (x in result){
                    var infos = result[x]['id'];
                    $("#infos").append('<ul>'+
                    '<li>'+infos+'</li>' +
                    '</ul>');
                    //alert(infos)
                }
                
            }
        );
    }
    get_temps();
    setInterval('get_temps()', 1000); // 队伍情况每一秒刷新一次
</script>

<script type="text/javascript">
function submitflag(){
//$('#test').value(mytoken);

/*
$.post('flag?token='+mytoken,
{flag:$("#flag").val()},
function(data,status){
    $("#msg").text(data['msg']);
}
);

*/

$.ajax({
        url:'flag?token='+mytoken,
        data:{flag:$("#flag").val()},
        type : 'post',
        dataType : 'json',  
        success:function(data,status){
            $("#msg").text(data['msg']);
        }
});

return false;
}
//setInterval('submitflag()',1000);

</script>